<template>
  <view style="width:100% !important" class="form-container">
    <view style="width:100% !important" class="form-box">
      <block v-for="(item, index) in formDate" :key="item.rules.name">
        <view class="form-item flex-row--c">
          <!-- 单行文本框 -->
          <view
            class="line"
            v-if="
              item.type == 'text' ||
              item.type == 'number' ||
              item.type == 'password'
            "
          >
            <view style="font-size: 28rpx;font-weight: 600;" :class="item.rules.verify ? 'line-left' : 'p-l14 line-left'"
              ><text  style="font-size: 30rpx;" class="colorRed" v-if="item.rules.verify">*</text
              >{{ item.label }}</view
            >
            <!-- 发送验证码 -->
            <view
              class="line-right send-code-box"
              v-if="item.rules.name == 'yzm'"
            >
              <input
			   style=""
                :type="item.type"
                class="input"
                placeholder-class="plaClass"
                :placeholder="item.placeholder"
                v-model="item.rules.value"
                @input="inputVal(index)"
              />
              <view class="send-code" @click="sendCode()" :style="sendColor">{{
                codeFont
              }}</view>
            </view>
            <!-- 普通输入框 -->
            <view style="font-size: 28rpx;font-weight: 600;" class="line-right" v-else>
              <input
			   style="font-size: 26rpx;;font-weight: 400"
                type="text"
                class="input"
                placeholder-class="plaClass"
                :placeholder="item.placeholder"
                v-model="item.rules.value"
                @input="inputVal(index)"
              />
            </view>
          </view>
          <!-- 下拉选择-->
          <view class="line" v-else-if="item.type == 'select'">
            <view style="font-size: 28rpx;font-weight: 600;" :class="item.rules.verify ? 'line-left' : 'p-l14 line-left'"
              ><text class="colorRed" v-if="item.rules.verify">*</text
              >{{ item.label }}</view
            >
            <view class="line-right">
              <input
                disabled
                type="text"
                class="input"
                placeholder-class="plaClass"
                :placeholder="item.placeholder"
                v-model="item.rules.label"
                @click="formDate2[index].show = true"
              />
              <view class="select-icon"> </view>
            </view>
            <f-select
              :title="item.title"
              :currentIndex="index"
              v-model="formDate2[index].show"
              :list="item.list"
              value-name="value"
              label-name="label"
              @confirm="selectConfirm"
            ></f-select>
          </view>
          <!-- 多行文本框 -->
          <view class="textarea-box" v-else-if="item.type == 'textarea'">
            <view style="font-size: 28rpx;font-weight: 600;color: black;" :class="item.rules.verify ? '' : 'p-l14 '"
              ><text class="colorRed" v-if="item.rules.verify">*</text
              >{{ item.label }}</view
            >
            <view class="line-bottom-textarea">
              <!-- placeholder-class="plaClass" -->
              <textarea
                rows=""
                style="font-size: 30rpx;font-weight: 400;width: 100%;height: 140rpx"
                auto-height
                :maxlength="-1"
                cols=""
                :placeholder="item.placeholder"
                v-model="item.rules.value"
                @input="inputVal(index)"
              >
              </textarea>
            </view>
          </view>
		  
		  
		  <!-- 日期格式 年月日 - 新 -->
		  <view class="line" v-else-if="item.type == 'time'">
            <view style="font-size: 28rpx;font-weight: 600;" :class="item.rules.verify ? 'line-left' : 'p-l14 line-left'"
              ><text class="colorRed" v-if="item.rules.verify">*</text
              >{{ item.label }}</view
            >
			 <view class="line-right">
				 
				<picker  style="padding-left: 20rpx;" mode="date" value="2024-01-01" start="2023-01-01" end="2025-01-01" @click="timeVal(index)" @change="timeChange">
					<view style="color: #818181;" class="uni-input">{{item.placeholder}}</view>
				</picker>
			    <view class="select-icon"> </view>
				<!-- <uni-datetime-picker type="date" :clear-icon="false" v-model="item.placeholder" :value="item.placeholder" @click="timeVal(index)" @change="timeChange" /> -->
			 </view>
		  </view>
          <!-- 上传图片 -->
          <view class="img-box" v-else-if="item.type == 'image'">
            <view style="font-size: 28rpx;font-weight: 600;" :class="item.rules[0].verify ? 'img-label' : 'p-l14 img-label'"
              ><text class="colorRed" v-if="item.rules[0].verify">*</text
              >{{ item.label }}</view
            >
            <view class="line-right">
              <view v-if="item.rules[0].value" class="update-img-box">
                <view class="update-img-box2">
                  <img
				    @click="goPreviewImage(index,0)"
                    :src="item.rules[0].value"
                    alt=""
                    mode="aspectFill"
                    class="update-img"
                  />
                  <img v-if="item.watermark.onlyShow!=undefined&&item.watermark.onlyShow=='false'"
                    src="https://yzhsaas-cdn.qietongvip.com/yzhvideo/delete_img.png"
                    alt=""
                    class="close-img"
                    @click="deleteImg1(index,0)"
                  />
                </view>
              </view>
              <view v-if="!item.rules[0].value" class="update-btn-box">
                <img
                  src="https://yzhsaas-cdn.qietongvip.com/yzhvideo/update_btn.png"
                  alt=""
                  mode="aspectFill"
                  @click="chooseImage1(index,0)"
                />
              </view>
            </view>
			<view class="line-right">
			  <view v-if="item.rules[1].value" class="update-img-box">
			    <view class="update-img-box2">
			      <img
				    @click="goPreviewImage(index,1)"
			        :src="item.rules[1].value"
			        alt=""
			        mode="aspectFill"
			        class="update-img"
			      />
			      <img v-if="item.watermark.onlyShow!=undefined&&item.watermark.onlyShow=='false'"
			        src="https://yzhsaas-cdn.qietongvip.com/yzhvideo/delete_img.png"
			        alt=""
			        class="close-img"
			        @click="deleteImg1(index,1)"
			      />
			    </view>
			  </view>
			  <view v-if="!item.rules[1].value" class="update-btn-box">
			    <img
			      src="https://yzhsaas-cdn.qietongvip.com/yzhvideo/update_btn.png"
			      alt=""
			      mode="aspectFill"
			      @click="chooseImage2(index,1)"
			    />
			  </view>
			</view>
			<view class="line-right">
			  <view v-if="item.rules[2].value" class="update-img-box">
			    <view class="update-img-box2">
			      <img
				    @click="goPreviewImage(index,2)"
			        :src="item.rules[2].value"
			        alt=""
			        mode="aspectFill"
			        class="update-img"
			      />
			      <img v-if="item.watermark.onlyShow!=undefined&&item.watermark.onlyShow=='false'"
			        src="https://yzhsaas-cdn.qietongvip.com/yzhvideo/delete_img.png"
			        alt=""
			        class="close-img"
			        @click="deleteImg1(index,2)"
			      />
			    </view>
			  </view>
			  <view v-if="!item.rules[2].value" class="update-btn-box">
			    <img
			      src="https://yzhsaas-cdn.qietongvip.com/yzhvideo/update_btn.png"
			      alt=""
			      mode="aspectFill"
			      @click="chooseImage3(index,2)"
			    />
			  </view>
			</view>
          </view>
		  
		  <!-- 上传视频 -->
		  <view class="img-box" v-else-if="item.type == 'video'">
		    <view style="font-size: 28rpx;font-weight: 600;" :class="item.rules.verify ? 'img-label' : 'p-l14 img-label'"
		      ><text class="colorRed" v-if="item.rules.verify">*</text
		      >{{ item.label }}</view
		    >
		    <view class="line-right">
		      <view v-if="item.rules.value" class="update-img-box">
		        <view class="update-img-box2">
		          <img
		            src="/static/loadedvideo.png"
		            alt=""
		            mode="aspectFill"
		            class="update-img"
		          />
		          <img v-if="item.onlyShow!=undefined&&item.onlyShow=='false'"
		            src="https://yzhsaas-cdn.qietongvip.com/yzhvideo/delete_img.png"
		            alt=""
		            class="close-img"
		            @click="deleteVideo(index)"
		          />
		        </view>
		      </view>
		      <view v-if="!item.rules.value" class="update-btn-box">
		        <img
		          src="https://yzhsaas-cdn.qietongvip.com/yzhvideo/update_btn.png"
		          alt=""
		          mode="aspectFill"
		          @click="chooseVideo(index)"
		        />
		      </view>
		    </view>
		  </view>
		  
		  <!-- 上传图片 -->
		  <view class="img-box" v-else-if="item.type == 'imageMulti'">
		    <view style="font-size: 28rpx;font-weight: 600;" :class="item.rules.verify ? 'img-label' : 'p-l14 img-label'"
		      ><text class="colorRed" v-if="item.rules.verify">*</text
		      >{{ item.label }}</view
		    >
		    <view v-for="(jtem,indexC) in item.counts" class="line-right">
		      <view v-if="item.rules.imagesList[indexC]" class="update-img-box">
		        <view class="update-img-box2">
		          <img
		  			@click="goPreviewImageMulit(index,indexC)"
		            :src="item.rules.imagesList[indexC]"
		            alt=""
		            mode="aspectFill"
		            class="update-img"
		          />
		          <img v-if="item.watermark.onlyShow!=undefined&&item.watermark.onlyShow=='false'"
		            src="https://yzhsaas-cdn.qietongvip.com/yzhvideo/delete_img.png"
		            alt=""
		            class="close-img"
		            @click="deleteImgMulit(index,indexC)"
		          />
		        </view>
		      </view>
		      <view v-if="!item.rules.imagesList[indexC]" class="update-btn-box">
		        <img
		  	    src="https://yzhsaas-cdn.qietongvip.com/yzhvideo/update_btn.png"
		        alt=""
		        mode="aspectFill"
		          @click="chooseImageMulti(index,indexC)"
		        />
		      </view>
		    </view>
		  </view>
		  <!-- 上传文件 -->
		  <view class="img-box" v-else-if="item.type == 'file'">
		    <view style="font-size: 28rpx;font-weight: 600;" :class="item.rules.verify ? 'img-label' : 'p-l14 img-label'">
				<text class="colorRed" v-if="item.rules.verify">*</text>
				{{ item.label }}
			</view>
			<view v-if="!item.rules.isView" class="fileuploadBox">
				<uni-file-picker
					@delete="(files) => deleteFile(index, files)"
					@select='(files) => selectFile(index, files)'
					v-model="formData.fileList"
					limit="1"
					file-mediatype="all"
					title="最多选择1个文件" 
				:auto-upload="false"></uni-file-picker>
			</view>
			
			<view v-if="item.rules.isView" class="uploadBox">
				
				<view class="tipsWord">
					查看上传文件
				</view>
				<button class="uploadBtn" @tap="downloadFile(item.rules.value)">下载</button>
						
				<view class="progress-container" v-if="isShowProgress">
					<view class="progress-box">
						<view class="text">文件下载中，请稍后......</view>
						<progress :percent="progress" show-info stroke-width="3" />
					</view>
				</view>
			</view>
			
		  </view>

          <!-- 单选框 -->
          <view class="line-col" v-else-if="item.type == 'radio'">
            <view style="font-size: 28rpx;font-weight: 600;" :class="item.rules.verify ? 'line-left' : 'p-l14 line-left'"
              ><text class="colorRed" v-if="item.rules.verify">*</text
              >{{ item.label }}
              </view
            >
            <view
              class="line-bottom-select"
              style='padding-left:10rpx'
            >
              <f-radio-group
                :currentIndex="index"
                v-model="formDate2[index].rules.label"
                @change="radioChange"
              >
			  <f-radio
			        icon-size="65"
			        label-size="35"
			        shape="circle"
			        v-for="(radioItem, radioIndex) in item.list"
			        :key="radioIndex"
			        :name="radioItem.label"
			        :disabled="radioItem.disabled"
			 >{{ radioItem.label }}</f-radio
			   >
              </f-radio-group>
			<!-- 新增异常描述输入框 -->
			<view v-if="item.rules.showRemarkInput" class="remark-input">
			   <textarea
				  placeholder="请输入异常描述"
				  v-model="item.rules.remarkValue"
				  @input="inputVal(index)"
				  class="remark-input-field"
				></textarea>
			</view>
            </view>
          </view>
		  
		  <!-- 单选框1 -->
		  <view class="line-col" v-else-if="item.type == 'radio1'">
		    <view style="font-size: 28rpx;font-weight: 600;" :class="item.rules.verify ? 'line-left' : 'p-l14 line-left'"
		      ><text class="colorRed" v-if="item.rules.verify">*</text
		      >{{ item.label }}
		      </view
		    >
		    <view
		      class="line-bottom-select"
		      style='padding-left:10rpx'
		    >
		       <f-radio-group
		          :currentIndex="index"
		          v-model="formDate2[index].rules.label"
		          @change="radioChange"
		          style="display: flex; flex-wrap: wrap; width: 100%;"
		        >
		          <f-radio
		            v-for="(radioItem, radioIndex) in item.list"
		            :key="radioIndex"
		            :name="radioItem.label"
		            :disabled="radioItem.disabled"
		          >
		            {{ radioItem.label }}
		          </f-radio>
		        </f-radio-group>
		    </view>
		  </view>
          <!-- 多选框 -->
          <view class="line-col" v-else-if="item.type == 'checkbox'">
            <view style="font-size: 28rpx;font-weight: 600;" :class="item.rules.verify ? 'line-left' : 'p-l14 line-left'"
              ><text class="colorRed" v-if="item.rules.verify">*</text
              >{{ item.label }}
            </view>
            <view
              class="line-bottom-select"
              style='padding-left:10rpx'
            >
              <f-checkbox-group
                :currentIndex="index"
                @change="checkboxGroupChange"
              >
                <f-checkbox
				  style="margin-right: 10rpx;margin-bottom: 20rpx;"
                  icon-size="65"
                  label-size="35"
                  v-model="formDate2[index].list[checkboxIndex].checked"
                  v-for="(checkboxItem, checkboxIndex) in item.list"
                  :key="checkboxIndex"
                  :name="checkboxItem.name"
                  >{{ checkboxItem.name }}</f-checkbox
                >
              </f-checkbox-group>
            </view>
          </view>

          <!-- 手机输入框 -->
          <view class="line" v-else-if="item.type == 'phone'">
            <view style="font-size: 28rpx;font-weight: 600;" :class="item.rules.verify ? 'line-left' : 'p-l14 line-left'"
              ><text class="colorRed" v-if="item.rules.verify">*</text
              >{{ item.label }}</view
            >
            <view class="line-right">
              <input
                type="number"
                v-model="formDate2[index].rules.value"
                :placeholder="item.placeholder"
                @input="inputVal(index)"
                class="input"
                :maxlength="11"
                placeholder-class="plaClass"
              />
              <t-button
                height="52rpx"
                width="180rpx"
                open-type="getPhoneNumber"
                @getphonenumber="getphonenumber"
                v-if="item.oneKeyPhone"
                >一键获取
              </t-button>
            </view>
          </view>
          <!-- 删除按钮 -->
          <view class="del-button">
            <text
              class="saasIcon"
              style="margin-right: 20rpx; color: var(--color)"
              @click="editFormItem(index)"
              v-if="isEdit"
              >&#xe6ef;</text
            >
            <text
              class="saasIcon"
              style="color: red"
              @click="delFormItem(index)"
              v-if="isDel && isEdit"
              >&#xe79d;</text
            >
          </view>
        </view>
      </block>
    </view>
	
	<view style='width:0px;height:0px;overflow:hidden;position:absolute;top: -999999px;'>
		<view><canvas :style="{ width: w, height: h }" canvas-id="firstCanvas1"></canvas></view>
	</view>
	<view style='width:0px;height:0px;overflow:hidden;position:absolute;top: -999999px;'>
		<view><canvas :style="{ width: w, height: h }" canvas-id="firstCanvas2"></canvas></view>
	</view>
	<view style='width:0px;height:0px;overflow:hidden;position:absolute;top: -999999px;'>
		<view><canvas :style="{ width: w, height: h }" canvas-id="firstCanvas3"></canvas></view>
	</view>
  </view>
</template>

<script>
import request from '@/common/request.js';
import time from '@/common/time.js';
import FCheckboxGroup from "./components/checkbox-group.vue";
import FCheckbox from "./components/checkbox.vue";
import FRadioGroup from "./components/radio-group.vue";
import FRadio from "./components/radio.vue";
import FSelect from "./components/select.vue";
export default {
  components: {
    FCheckboxGroup,
    FCheckbox,
    FRadioGroup,
    FRadio,
    FSelect,
  },
  name: "activeForm",
  data() {
    return {
	  qiNiuToken:'',
	  customerName:'',
	  timeIndex:0,
      submitData: "",
      selectBox: [],
      currentSelectIndex: "",
      currentSelectValue: "",
      codeFont: "获取验证码",
      wait: 60,
      isSend: false,
      sendColor: "color:#ff5b01",
      formDate2: this.formDate,
	  w:0,
	  h:0,
	  onlyShow:0,
	  isShowProgress: false,
	  progress: 0,
    };
  },
  props: {
    //是否展示序号
    num: {
      type: Boolean,
      default: false,
    },
    formDate: {
      type: Array,
      default: () => {
        return [];
      },
    },
    //是否编辑表单
    isEdit: {
      type: Boolean,
      default: false,
    },
    //是否能删除
    isDel: {
      type: Boolean,
      default: false,
    },
  },
  watch: {
    //监听formDate变化并赋值
    formDate: {
      handler(nval) {
        this.formDate2 = nval;
      },
    },
  },
  methods: {
	  goPreviewImageMulit(itemindex,imageindex){
	  	let url= this.formDate2[itemindex].rules.imagesList[imageindex];
	  	console.log('url：'+url)
	  	let urls=[]
	  	urls.push(url+'?imageMogr2/format/jpg/quality/60')
	  	//console.log(urls)
	  	uni.previewImage({
	  		urls:urls
	  	});
	  },
	  deleteImgMulit(index,imagesIndex){
	  	let that=this
	  	uni.showLoading({
	  		title: '删除中...'
	  	})
	  	let url='api/DeleteQiNiuFile'
	  	if(request.FileType=='SystemFile'){
	  		url='api/DeleteFileByPath'
	  	}
	  	let opts = {
	  		url: url,
	  		method: 'get'
	  	};
	  	//console.log('deleteFilePath:'+this.formDate2[index].rules.imagesList[imagesIndex])
	  	let params={
	  		filePath:this.formDate2[index].rules.imagesList[imagesIndex],
	  		isComplete:true
	  	}
	  	request.httpTokenRequest(opts,params).then(res => {
	  		uni.hideLoading();
	  		if(res.data.code == 1){
	  			this.formDate2[index].rules.imagesList[imagesIndex] = "";
	  			this.$emit("update:formDate", this.formDate2);
	  		}
	  		else{
	  			uni.showToast({ title: res.data.msg, icon: 'none' });
	  		}
	  	});
	  },
	  chooseImageMulti(index,imagesIndex) {
	  	let that=this
	  	that.getQiNiuToken()
	  	let watermark=that.formDate2[index].watermark
	  	let fileType=999
	  	if(watermark.fileType!=''&&watermark.fileType!=null&&watermark.fileType!=undefined){
	  		fileType=watermark.fileType
	  	}
	  	uni.chooseImage({
	  		count: 1,
	  		sizeType: ["compressed"],
	  		sourceType: ['camera','album'],
	  		//sourceType:sourceType,
	  		success: (res) => {
	  			let token =uni.getStorageSync('userdata').token;
	  			const imageSize = res.tempFiles[0].size;  // 单位是字节（Byte）
	  			uni.showLoading({title: '上传中...'})
	  			//加水印-start
	  			uni.getImageInfo({
	  				src:res.tempFilePaths[0],
	  				success: ress => {
	  					// 获取图片大小
	  					let quality=0.3
	  					let beishu=3
	  					const maxSize1 = 3 * 1024 * 1024;  // 3MB
	  					const maxSize2 = 6 * 1024 * 1024;  // 6MB
	  					if (imageSize > maxSize2) {
	  					    quality = 0.1;  // 大于 6MB
	  						beishu=6
	  					} else if (imageSize > maxSize1) {
	  					    quality = 0.2;   // 大于 3MB 且小于等于 6MB
	  						beishu==5
	  					} else {
	  					    quality = 0.3;   // 小于等于 3MB
	  						beishu=3
	  					}
	  					
	  					that.w = ress.width / beishu + 'px';
	  					that.h = ress.height /beishu + 'px';
	  					let ctx = uni.createCanvasContext('firstCanvas1',this); /** 创建画布 */
	  					//console.log(ctx)
	  					//ctx.draw()
	  					//将图片src放到cancas内，宽高为图片大小
	  					that.$nextTick(function(){
	  						ctx.drawImage(res.tempFilePaths[0], 0, 0, ress.width / beishu, ress.height / beishu);	
	  					})
	  					that.$nextTick(function(){
	  						ctx.setFontSize(10);
	  						ctx.setFillStyle('#FFFFFF');
	  						let textToWidth = (ress.width / beishu) * 0.03;
	  						
	  						let textToHeight5 = (ress.height / beishu) * 0.82
	  						ctx.fillText(watermark.jingweidu, textToWidth, textToHeight5);
	  													
	  						let textToHeight4 = (ress.height /beishu) * 0.86;
	  						ctx.fillText(watermark.UserName, textToWidth, textToHeight4);
	  						
	  						let textToHeight = (ress.height / beishu) * 0.9;
	  						ctx.fillText(watermark.JobName, textToWidth, textToHeight);
	  													
	  						ctx.setFontSize(10);
	  						let textToHeight2 = (ress.height /beishu) * 0.94;
	  						ctx.fillText(watermark.nowTime, textToWidth, textToHeight2);
	  													
	  						let textToHeight3 = (ress.height / beishu) * 0.98;
	  						ctx.fillText(watermark.address, textToWidth, textToHeight3);
	  					})
	  					
	  					that.$nextTick(function(){
	  						uni.showLoading({
	  							title: '解析中...'
	  						})
	  						ctx.draw(false, () => {
	  							setTimeout(() => {
	  								uni.canvasToTempFilePath({
	  									canvasId: 'firstCanvas1',
	  									quality: 0.2, // 设置压缩质量 (0.1 - 1)
	  									success: res1 => {
	  										uni.showLoading({
	  											title: '上传中...'
	  										})
	  										let tempImagePath121 = res1.tempFilePath;
	  										//加水印-end
	  										if(request.FileType=='SystemFile'){
	  											that.uploadImageToSystemMulti(tempImagePath121,index,imagesIndex,fileType,watermark.customerName)
	  										}else
	  										{
	  											that.uploadImageToQiNiuMulti(tempImagePath121,index,imagesIndex,fileType,watermark.customerName)
	  										}
	  										uni.hideLoading()
	  									}
	  								},this);
	  							}, 1000);
	  						});
	  						uni.hideLoading();
	  					})
	  					uni.hideLoading();
	  				}
	  			});
	  			//加水印-end
	  		},
	  		fail: (err) => {
	  			uni.hideLoading();
	  			uni.showToast({ title:'图片上传失败13', icon: 'none' });
	  		},
	  	});
	  },
	  // 上传文件
	  // uploadFileToQiNiu
	selectFile(index, res){
		let that=this
		let {tempFiles, tempFilePaths} = res
		tempFiles.forEach(ele => {
			let {name, url, uuid, file} = ele
			this.formDate2[index].fileList.push({
					name,
					url,
					file,
					uuid,
			})
			new Promise((resolve, reject) =>  {
				let token =uni.getStorageSync('userdata').token;
				let customerName =uni.getStorageSync('userdata').FileName;
				for(let i=0;i<this.formDate2[index].fileList.length;i++){
					let file=this.formDate2[index].fileList[i]
					let tempFile=file.url
					console.log('tempFile',tempFile)
					uni.uploadFile({
						url: this.$request22.baseUrl1+'/File/UploadMutilesFiles?customerName='+customerName, 
						filePath: tempFile,
						name: 'fileList',
						method: 'post',
						header: {
							'Content-Type': 'multipart/form-data; charset=UTF-8' ,// 在这里设置编码
							'token': token,
						},
						success: (uploadFileRes) => {
							let result=JSON.parse(uploadFileRes.data)
							console.log('result',uploadFileRes)
							if(result.Tag==1){
								console.log(result.Data[0])
								that.formDate2[index].rules.value = this.$request22.baseUrl1+result.Data[0];
								this.$emit("update:formDate", this.formDate2);
								uni.showToast({ title:'上传成功', icon: 'none' });
							}
						},fail(err) {
							console.log(err)
							uni.hideLoading();
							uni.showToast({ title:'上传失败', icon: 'none' });
						}
					});
				}
				
			})
		})
	},
	//未完待续
	selectMultiImages(index, res){
		let that=this
		let {tempFiles, tempFilePaths} = res
		tempFiles.forEach(ele => {
			let {name, url, uuid, file} = ele
			console.log('filelist:'+this.formDate2[index].fileList)
			this.formDate2[index].fileList.push({
				name,
				url,
				file,
				uuid,
			})
			new Promise((resolve, reject) =>  {
				let token =uni.getStorageSync('userdata').token;
				let customerName =uni.getStorageSync('userdata').FileName;
				for(let i=0;i<this.formDate2[index].fileList.length;i++){
					let file=this.formDate2[index].fileList[i]
					let tempFile=file.url
					console.log('tempFile',tempFile)
					uni.uploadFile({
						url: this.$request22.baseUrl1+'/File/UploadMutilesFiles?customerName='+customerName, 
						filePath: tempFile,
						name: 'fileList',
						method: 'post',
						header: {
							'Content-Type': 'multipart/form-data; charset=UTF-8' ,// 在这里设置编码
							'token': token,
						},
						success: (uploadFileRes) => {
							let result=JSON.parse(uploadFileRes.data)
							console.log('result',uploadFileRes)
							if(result.Tag==1){
								console.log(result.Data[0])
								that.formDate2[index].rules.value = this.$request22.baseUrl1+result.Data[0];
								this.$emit("update:formDate", this.formDate2);
								uni.showToast({ title:'上传成功', icon: 'none' });
							}
						},fail(err) {
							console.log(err)
							uni.hideLoading();
							uni.showToast({ title:'上传失败', icon: 'none' });
						}
					});
				}
				
			})
		})
	},
	// 删除文件
	deleteFile(index,res){
		let that=this
		console.log(res)
		let {tempFile: {uuid}} = res
		let Index = null
		let tar = that.formData2[index].fileList.filter((file, index) => {
			if (file.uuid == uuid) {
				Index = index
			}
		})
		if (typeof Index == 'number') {
			that.formData2[index].fileList.splice(Index, 1)
		}
		uni.showLoading({
			title: '删除中...'
		})
		let opts = {
			url: 'api/DeleteQiNiuFile',
			method: 'get'
		};
		let params={
			filePath:that.formDate2[index].rules.value,
			isComplete:true
		}
		request.httpTokenRequest(opts,params).then(res => {
			uni.hideLoading();
			if(res.data.code == 1){
			    that.formDate2[index].rules.value = "";
			    this.$emit("update:formDate", this.formDate2);
			}
			else{
				uni.showToast({ title: res.data.msg, icon: 'none' });
			}
		});
	},
	// 下载文件
	downloadFile(fileAddress){
		console.log('fileAddress', fileAddress)
		const downloadTask = uni.downloadFile({
			url: fileAddress,
			success: res => {
				if (res.statusCode === 200) {
					this.isShowProgress = false;
					console.log('下载成功');
				}
				let that = this;
				uni.saveFile({
					tempFilePath: res.tempFilePath,
					success: function(red) {
						that.isShowProgress = false;
						uni.showModal({
							title: '提示',
							content: '文件已保存：' + red.savedFilePath,
							cancelText: '我知道了',
							confirmText: '打开文件',
							success: function (res) {
								if (res.confirm) {
									console.log('打开',red.savedFilePath)
									uni.openDocument({
										filePath: red.savedFilePath,
										success: (sus) => {
											console.log('成功打开');
										}
									})
								}
							}
						});
					}
				});
			}
		})
		
		downloadTask.onProgressUpdate((res) => {
			if(res.progress > 0) {
				this.isShowProgress = true;
			}
			this.progress = res.progress;
			console.log('下载进度：' + res.progress);
			console.log('已下载长度：' + res.totalBytesWritten);
			console.log('文件总长度：' + res.totalBytesExpectedToWrite);
		})
	},
	goPreviewImage(itemindex,imageindex){
		let url= this.formDate2[itemindex].rules[imageindex].value;
		url=url+'?imageMogr2/format/jpg/quality/30'
		let urls=[]
		urls.push(url)
		uni.previewImage({
			urls:urls
		});
	},
    async getphonenumber({ detail }) {
      if (detail.errMsg === "getPhoneNumber:ok") {
        //console.log("detail :>> ", detail);
        // return;
        const { code, data } = await this.$api.yzhvideo.baseA2.bindPhone({
          iv: detail.iv,
          encrypt_data: detail.encryptedData,
        });

        if (code == 200) {
          const { user_info } = await this.$store.dispatch(
            "yzhvideo/getUserInfo"
          );
          this.formDate2.forEach((item, index) => {
            if (item.type === "phone") {
              this.formDate2[index].rules.value = user_info.phone;
              this.$emit("update:formDate", this.formDate2);
            }
          });
        }
      }
    },
    // 点击删除表单项
    delFormItem(index) {
      //console.log("index :>> ", index);
      this.formDate2.splice(index, 1);
      this.$emit("update:formDate", this.formDate2);
    },
    // 编辑该选项
    editFormItem(index) {
      //console.log("编辑该选项 :>> ", index, this.formDate2[index]);
      this.$emit("edit", { data: this.formDate2[index], index });
    },
    //input输入框的值传给父组件
    inputVal(index) {
      const data = {
        val: this.formDate[index].rules.value,
        index: index,
      };
      if (String(data.val) != "" && String(data.index) != "") {
        this.formDate2[data.index].rules.value = data.val;
      }
      this.$emit("update:formDate", this.formDate2);
    },

    // 单选 下拉框点击确定
    selectConfirm(param) {
      this.formDate2[+param.currentIndex].rules.label = param[0].label;
      this.formDate2[+param.currentIndex].rules.value = param[0].value;
      this.$emit("update:formDate", this.formDate2);
    },
	timeVal(index){
		this.timeIndex=index
	},
	//日期，时间选择器  yyyy-MM-dd
	timeChange(e){
		this.formDate2[this.timeIndex].rules.value = e.detail.value;
		this.formDate2[this.timeIndex].placeholder=e.detail.value;
		this.$emit("update:formDate", this.formDate2);
	},
    //单选 点击触发
	  //   radioChange(param) {
			// this.formDate2[+param.currentIndex].rules.label = param.val;
			// this.formDate2[+param.currentIndex].rules.value = param.val;
			// this.$emit("update:formDate", this.formDate2);
	  //   },
    radioChange(param) {
        console.log("param:" + JSON.stringify(param));
        const index = +param.currentIndex;
        // 获取当前单选框所在项的列表
        const radioList = this.formDate2[index].list;
        // 获取用户选择的值对应的索引
        const selectedIndex = radioList.findIndex(item => item.label === param.val);
        // 判断是否选择了第二个选项（索引为 1）
        const isSecondOptionSelected = selectedIndex === 1;
    
        // 使用 $set 确保响应式
        this.$set(this.formDate2[index].rules, 'showRemarkInput', isSecondOptionSelected);
        this.$set(this.formDate2[index].rules, 'remarkValue', isSecondOptionSelected ? '' : null);
    
        // 更新主值
        this.formDate2[index].rules.value = param.val;
        this.$emit("update:formDate", this.formDate2);
    },
    //复选框 点击触发
    checkboxGroupChange(param) {
      this.formDate2[+param.currentIndex].rules.value = param.values;
      this.$emit("update:formDate", this.formDate2);
    },
	chooseImage1(index, imagesIndex) {
	    let that = this;
	    that.getQiNiuToken();
	    let watermark = that.formDate2[index].watermark;
	    let fileType = 999;
	    if (watermark.fileType!== '' && watermark.fileType!== null && watermark.fileType!== undefined) {
	        fileType = watermark.fileType;
	    }
	    let timeAll = time.parseDateTime(watermark.nowTime);
	
	    uni.chooseImage({
	        count: 1,
	        sizeType: ["compressed"],
	        sourceType: ['camera', 'album'],
	        success: (res) => {
	            let token = uni.getStorageSync('userdata').token;
	            const imageSize = res.tempFiles[0].size;  // 单位是字节（Byte）
	            uni.showLoading({ title: '解析中...' });
	
	            // 加水印 - start
	            uni.getImageInfo({
	                src: res.tempFilePaths[0],
	                success: ress => {
	                    // 获取图片大小
	                    let quality = 0.3;
	                    let beishu = 3;
	                    const maxSize1 = 3 * 1024 * 1024;  // 3MB
	                    const maxSize2 = 6 * 1024 * 1024;  // 6MB
	                    if (imageSize > maxSize2) {
	                        quality = 0.1;  // 大于 6MB
	                        beishu = 6;
	                    } else if (imageSize > maxSize1) {
	                        quality = 0.2;   // 大于 3MB 且小于等于 6MB
	                        beishu = 5;
	                    } else {
	                        quality = 0.3;   // 小于等于 3MB
	                        beishu = 3;
	                    }
	
	                    let ctx = uni.createCanvasContext('firstCanvas1', that); /** 创建画布 */
	                    that.w = ress.width / beishu + 'px';
	                    that.h = ress.height / beishu + 'px';
	
	                    // 根据图片缩放后的宽度计算水印相关的比例
	                    const scaledWidth = ress.width / beishu;
	                    const baseWidth = 640; // 基准宽度，可根据实际情况调整
	                    const scaleRatio = scaledWidth / baseWidth;
	
	                    // 计算水印框的宽度，并设置最大和最小宽度
	                    let w = scaledWidth * 0.5;
	                    const minWidth = 200; 
	                    const maxWidth = 400; 
	                    w = Math.min(Math.max(w, minWidth), maxWidth);
	
	                    // 根据比例调整水印框的高度
	                    let h = 130 * scaleRatio;
	
	                    // 水印框放到左上角
	                    let x = 10 * scaleRatio;
	                    let y = 10 * scaleRatio;
	                    // 圆角半径
	                    let r = 10 * scaleRatio;
	
	                    that.$nextTick(function () {
	                        ctx.drawImage(res.tempFilePaths[0], 0, 0, scaledWidth, ress.height / beishu);
	                    });
	
	                    that.$nextTick(function () {
	                        ctx.beginPath();
	                        ctx.setFillStyle('transparent');
	                        ctx.arc(x + r, y + r, r, Math.PI, Math.PI * 1.5);
	
	                        // border-top
	                        ctx.moveTo(x + r, y);
	                        ctx.lineTo(x + w - r, y);
	                        ctx.lineTo(x + w, y + r);
	                        // 右上角
	                        ctx.arc(x + w - r, y + r, r, Math.PI * 1.5, Math.PI * 2);
	
	                        // border-right
	                        ctx.lineTo(x + w, y + h - r);
	                        ctx.lineTo(x + w - r, y + h);
	                        // 右下角
	                        ctx.arc(x + w - r, y + h - r, r, 0, Math.PI * 0.5);
	
	                        // border-bottom
	                        ctx.lineTo(x + r, y + h);
	                        ctx.lineTo(x, y + h - r);
	                        // 左下角
	                        ctx.arc(x + r, y + h - r, r, Math.PI * 0.5, Math.PI);
	
	                        // border-left
	                        ctx.lineTo(x, y + r);
	                        ctx.lineTo(x + r, y);
	
	                        // 填充水印区域
	                        ctx.fill();
	                        ctx.closePath();
	                        ctx.clip();
	                        ctx.setFillStyle('rgba(255, 255, 255, 0.3)');
	                        ctx.fillRect(x, y, w, h);
	
	                        // 从第一段代码获取固定值
	                        let time = timeAll.time;
	                        let date = timeAll.date;
	                        let week = timeAll.weekDay;
	                        let address = watermark.address || "位置未授权";
	                        let jingweidu = watermark.jingweidu || "位置未授权";
	                        let username = watermark.UserName;
	                        let jobname = watermark.JobName;
	
	                        let fillheight = 0;
	                        // 根据比例调整字体大小
	                        ctx.setFontSize(26 * scaleRatio); 
	                        ctx.setFillStyle('#FFFFFF'); 
	                        ctx.fillText(time, x + 20 * scaleRatio, y + 42 * scaleRatio + fillheight);
	
	                        let timeW = ctx.measureText(time).width;
	                        ctx.setFillStyle('#FFFF00'); 
	                        ctx.fillRect(x + 30 * scaleRatio + timeW, y + 20 * scaleRatio + fillheight, 4 * scaleRatio, 24 * scaleRatio);
	
	                        ctx.setFontSize(12 * scaleRatio); 
	                        ctx.setFillStyle('#FFFFFF'); 
	                        ctx.fillText(date, x + 30 * scaleRatio + timeW + 16 * scaleRatio, y + 32 * scaleRatio + fillheight);
	
	                        ctx.setFontSize(12 * scaleRatio); 
	                        ctx.setFillStyle('#FFFFFF'); 
	                        ctx.fillText(week, x + 30 * scaleRatio + timeW + 16 * scaleRatio, y + 44 * scaleRatio + fillheight);
	
	                        ctx.setFontSize(12 * scaleRatio); 
	                        ctx.fillText(address, x + 20 * scaleRatio, y + 60 * scaleRatio + fillheight);
	
	                        ctx.setFontSize(12 * scaleRatio); 
	                        ctx.fillText(jingweidu, x + 20 * scaleRatio, y + 78 * scaleRatio + fillheight);
	
	                        ctx.setFontSize(12 * scaleRatio); 
	                        ctx.fillText("人员：" + username, x + 20 * scaleRatio, y + 94 * scaleRatio + fillheight);
	
	                        ctx.setFontSize(12 * scaleRatio); 
	                        ctx.fillText("数据类型：" + jobname, x + 20 * scaleRatio, y + 112 * scaleRatio + fillheight);
	                    });
	
	                    that.$nextTick(function () {
	                        ctx.draw(false, () => {
	                            setTimeout(() => {
	                                uni.canvasToTempFilePath({
	                                    canvasId: 'firstCanvas1',
	                                    quality: quality, // 设置压缩质量 (0.1 - 1)
	                                    success: res1 => {
	                                        let tempImagePath121 = res1.tempFilePath;
	                                        // 加水印 - end
	                                        if (request.FileType === 'SystemFile') {
	                                            that.uploadImageToSystem(tempImagePath121, index, imagesIndex, fileType, watermark.customerName);
	                                        } else {
	                                            that.uploadImageToQiNiu(tempImagePath121, index, imagesIndex, fileType, watermark.customerName);
	                                        }
	                                    },
	                                    fail(err11) {
	                                        console.log('err11:' + JSON.stringify(err11));
	                                        uni.hideLoading();
	                                        uni.showToast({ title: '图片上传失败15', icon: 'none' });
	                                    }
	                                }, that);
	                            }, 1000);
	                        });
	                    });
	                },
	                fail() {
	                    uni.hideLoading();
	                    uni.showToast({ title: '图片上传失败14', icon: 'none' });
	                }
	            });
	            // 加水印 - end
	        },
	        fail: (err) => {
	            uni.hideLoading();
	            uni.showToast({ title: '图片上传失败13', icon: 'none' });
	        },
	    });
	},
    // 上传图片
    chooseImage1Old(index,imagesIndex) {
		let that=this
		that.getQiNiuToken()
		let watermark=that.formDate2[index].watermark
		let fileType=999
		if(watermark.fileType!=''&&watermark.fileType!=null&&watermark.fileType!=undefined){
			fileType=watermark.fileType
		}
		uni.chooseImage({
			count: 1,
			sizeType: ["compressed"],
			sourceType: ['camera','album'],
			//sourceType:sourceType,
			success: (res) => {
				let token =uni.getStorageSync('userdata').token;
				const imageSize = res.tempFiles[0].size;  // 单位是字节（Byte）
				uni.showLoading({title: '解析中...'})
				//加水印-start
				uni.getImageInfo({
					src:res.tempFilePaths[0],
					success: ress => {
						// 获取图片大小
						let quality=0.3
						let beishu=3
						const maxSize1 = 3 * 1024 * 1024;  // 3MB
						const maxSize2 = 6 * 1024 * 1024;  // 6MB
						if (imageSize > maxSize2) {
						    quality = 0.1;  // 大于 6MB
							beishu=6
						} else if (imageSize > maxSize1) {
						    quality = 0.2;   // 大于 3MB 且小于等于 6MB
							beishu==5
						} else {
						    quality = 0.3;   // 小于等于 3MB
							beishu=3
						}
						
						that.w = ress.width / beishu + 'px';
						that.h = ress.height / beishu + 'px';
						let ctx = uni.createCanvasContext('firstCanvas1',this); /** 创建画布 */
						//console.log(ctx)
						//ctx.draw()
						//将图片src放到cancas内，宽高为图片大小
						that.$nextTick(function(){
							ctx.drawImage(res.tempFilePaths[0], 0, 0, ress.width / beishu, ress.height / beishu);	
						})
						that.$nextTick(function(){
							ctx.setFontSize(10);
							ctx.setFillStyle('#FFFFFF');
							let textToWidth = (ress.width / beishu) * 0.03;
														
							let textToHeight5 = (ress.height / beishu) * 0.82
							ctx.fillText(watermark.UserName ,textToWidth, textToHeight5);
														
							let textToHeight4 = (ress.height / beishu) * 0.86;
							ctx.fillText(watermark.JobName, textToWidth, textToHeight4);
							
							let textToHeight = (ress.height / beishu) * 0.9;
							ctx.fillText(watermark.nowTime, textToWidth, textToHeight);
														
							ctx.setFontSize(10);
							let textToHeight2 = (ress.height / beishu) * 0.94;
							ctx.fillText(watermark.jingweidu, textToWidth, textToHeight2);
														
							let textToHeight3 = (ress.height / beishu) * 0.98;
							ctx.fillText(watermark.address, textToWidth, textToHeight3);
						})
						
						that.$nextTick(function(){
							ctx.draw(false, () => {
								setTimeout(() => {
									uni.canvasToTempFilePath({
										canvasId: 'firstCanvas1',
										quality: quality, // 设置压缩质量 (0.1 - 1)
										success: res1 => {
											let tempImagePath121 = res1.tempFilePath;
											//加水印-end
											if(request.FileType=='SystemFile'){
												that.uploadImageToSystem(tempImagePath121,index,imagesIndex,fileType,watermark.customerName)
											}else
											{
												that.uploadImageToQiNiu(tempImagePath121,index,imagesIndex,fileType,watermark.customerName)
											}
										},fail() {
											uni.hideLoading();
											uni.showToast({ title:'图片上传失败15', icon: 'none' });
										}
									},this);
								}, 1000);
							});
						})
					},fail() {
						uni.hideLoading();
						uni.showToast({ title:'图片上传失败14', icon: 'none' });
					}
				});
				//加水印-end
			},
			fail: (err) => {
				uni.hideLoading();
				uni.showToast({ title:'图片上传失败13', icon: 'none' });
			},
		});
    },
    // 删除图片
    deleteImg1(index,imagesIndex) {
		let that=this
		uni.showLoading({
			title: '删除中...'
		})
		let url='api/DeleteQiNiuFile'
		if(request.FileType=='SystemFile'){
			url='api/DeleteFileByPath'
		}
		let opts = {
			url: url,
			method: 'get'
		};
		let params={
			filePath:this.formDate2[index].rules[imagesIndex].value,
			isComplete:true
		}
		request.httpTokenRequest(opts,params).then(res => {
			uni.hideLoading();
			if(res.data.code == 1){
				this.formDate2[index].rules[imagesIndex].value = "";
				this.$emit("update:formDate", this.formDate2);
			}
			else{
				uni.showToast({ title: res.data.msg, icon: 'none' });
			}
		});
    },
	// 上传图片
	chooseImage2(index,imagesIndex) {
		let that=this
		that.getQiNiuToken()
		let watermark=that.formDate2[index].watermark
		let fileType=999
		if(watermark.fileType!=''&&watermark.fileType!=null&&watermark.fileType!=undefined){
			fileType=watermark.fileType
		}
		let timeAll=time.parseDateTime(watermark.nowTime)
	  uni.chooseImage({
	    count: 1,
	    sizeType: ["compressed"],
        //sourceType: sourceType,
		sourceType: ['camera','album'],
	    success: (res) => {
			let token =uni.getStorageSync('userdata').token;
			const imageSize = res.tempFiles[0].size;  // 单位是字节（Byte）
			uni.showLoading({title: '解析中...'})
			
			//加水印-start
			uni.getImageInfo({
				src:res.tempFilePaths[0],
				success: ress => {
					// 获取图片大小
					let quality=0.3
					let beishu=3
					const maxSize1 = 3 * 1024 * 1024;  // 3MB
					const maxSize2 = 6 * 1024 * 1024;  // 6MB
					if (imageSize > maxSize2) {
					    quality = 0.1;  // 大于 6MB
						beishu=6
					} else if (imageSize > maxSize1) {
					    quality = 0.2;   // 大于 3MB 且小于等于 6MB
						beishu==5
					} else {
					    quality = 0.3;   // 小于等于 3MB
						beishu=3
					}
					
					let ctx = uni.createCanvasContext('firstCanvas2', that); /** 创建画布 */
					that.w = ress.width / beishu + 'px';
					that.h = ress.height / beishu + 'px';
						
					// 根据图片缩放后的宽度计算水印相关的比例
					const scaledWidth = ress.width / beishu;
					const baseWidth = 640; // 基准宽度，可根据实际情况调整
					const scaleRatio = scaledWidth / baseWidth;
						
					// 计算水印框的宽度，并设置最大和最小宽度
					let w = scaledWidth * 0.5;
					const minWidth = 200; 
					const maxWidth = 400; 
					w = Math.min(Math.max(w, minWidth), maxWidth);
						
					// 根据比例调整水印框的高度
					let h = 130 * scaleRatio;
						
					// 水印框放到左上角
					let x = 10 * scaleRatio;
					let y = 10 * scaleRatio;
					// 圆角半径
					let r = 10 * scaleRatio;
					
					that.$nextTick(function(){
						ctx.drawImage(res.tempFilePaths[0], 0, 0, ress.width / beishu, ress.height / beishu);	
					})
					that.$nextTick(function () {
					   ctx.beginPath();
					   ctx.setFillStyle('transparent');
					   ctx.arc(x + r, y + r, r, Math.PI, Math.PI * 1.5);
					   	
					   // border-top
					   ctx.moveTo(x + r, y);
					   ctx.lineTo(x + w - r, y);
					   ctx.lineTo(x + w, y + r);
					   // 右上角
					   ctx.arc(x + w - r, y + r, r, Math.PI * 1.5, Math.PI * 2);
					   	
					   // border-right
					   ctx.lineTo(x + w, y + h - r);
					   ctx.lineTo(x + w - r, y + h);
					   // 右下角
					   ctx.arc(x + w - r, y + h - r, r, 0, Math.PI * 0.5);
					   	
					   // border-bottom
					   ctx.lineTo(x + r, y + h);
					   ctx.lineTo(x, y + h - r);
					   // 左下角
					   ctx.arc(x + r, y + h - r, r, Math.PI * 0.5, Math.PI);
					   	
					   // border-left
					   ctx.lineTo(x, y + r);
					   ctx.lineTo(x + r, y);
					   	
					   // 填充水印区域
					   ctx.fill();
					   ctx.closePath();
					   ctx.clip();
					   ctx.setFillStyle('rgba(255, 255, 255, 0.3)');
					   ctx.fillRect(x, y, w, h);
					   	
					   // 从第一段代码获取固定值
					   let time = timeAll.time;
					   let date = timeAll.date;
					   let week = timeAll.weekDay;
					   let address = watermark.address || "位置未授权";
					   let jingweidu = watermark.jingweidu || "位置未授权";
					   let username = watermark.UserName;
					   let jobname = watermark.JobName;
					   	
					   let fillheight = 0;
					   // 根据比例调整字体大小
					   ctx.setFontSize(26 * scaleRatio); 
					   ctx.setFillStyle('#FFFFFF'); 
					   ctx.fillText(time, x + 20 * scaleRatio, y + 42 * scaleRatio + fillheight);
					   	
					   let timeW = ctx.measureText(time).width;
					   ctx.setFillStyle('#FFFF00'); 
					   ctx.fillRect(x + 30 * scaleRatio + timeW, y + 20 * scaleRatio + fillheight, 4 * scaleRatio, 24 * scaleRatio);
					   	
					   ctx.setFontSize(12 * scaleRatio); 
					   ctx.setFillStyle('#FFFFFF'); 
					   ctx.fillText(date, x + 30 * scaleRatio + timeW + 16 * scaleRatio, y + 32 * scaleRatio + fillheight);
					   	
					   ctx.setFontSize(12 * scaleRatio); 
					   ctx.setFillStyle('#FFFFFF'); 
					   ctx.fillText(week, x + 30 * scaleRatio + timeW + 16 * scaleRatio, y + 44 * scaleRatio + fillheight);
					   	
					   ctx.setFontSize(12 * scaleRatio); 
					   ctx.fillText(address, x + 20 * scaleRatio, y + 60 * scaleRatio + fillheight);
					   	
					   ctx.setFontSize(12 * scaleRatio); 
					   ctx.fillText(jingweidu, x + 20 * scaleRatio, y + 78 * scaleRatio + fillheight);
					   	
					   ctx.setFontSize(12 * scaleRatio); 
					   ctx.fillText("人员：" + username, x + 20 * scaleRatio, y + 94 * scaleRatio + fillheight);
					   	
					   ctx.setFontSize(12 * scaleRatio); 
					   ctx.fillText("数据类型：" + jobname, x + 20 * scaleRatio, y + 112 * scaleRatio + fillheight);
					});
					that.$nextTick(function(){
						ctx.draw(false, () => {
							setTimeout(() => {
								uni.canvasToTempFilePath({
									canvasId: 'firstCanvas2',
									quality:quality, // 设置压缩质量 (0.1 - 1)
									success: res1 => {
										let tempImagePath121 = res1.tempFilePath;
										//加水印-end
										if(request.FileType=='SystemFile'){
											that.uploadImageToSystem(tempImagePath121,index,imagesIndex,fileType,watermark.customerName)
										}else
										{
											that.uploadImageToQiNiu(tempImagePath121,index,imagesIndex,fileType,watermark.customerName)
										}
									},fail() {
										uni.hideLoading();
										uni.showToast({ title:'图片上传失败15', icon: 'none' });
									}
								},this);
							}, 1000);
						});
					})
				},fail() {
					uni.hideLoading();
					uni.showToast({ title:'图片上传失败14', icon: 'none' });
				}
			});
			//加水印-end
	    },
	    fail: (err) => {
		    uni.hideLoading();
		    uni.showToast({ title:'图片上传失败', icon: 'none' });
	    },
	  });
	},
	// 上传图片
	chooseImage3(index,imagesIndex) {
		let that=this
		that.getQiNiuToken()
		let watermark=that.formDate2[index].watermark
		let fileType=999
		if(watermark.fileType!=''&&watermark.fileType!=null&&watermark.fileType!=undefined){
			fileType=watermark.fileType
		}
		let timeAll=time.parseDateTime(watermark.nowTime)
	  uni.chooseImage({
	    count: 1,
	    sizeType: ["compressed"],
        //sourceType:sourceType,
		sourceType: ['camera','album'],
	    success: (res) => {
			let token =uni.getStorageSync('userdata').token;
			uni.showLoading({title: '解析中...'})
			const imageSize = res.tempFiles[0].size;  // 单位是字节（Byte）
			//加水印-start
			uni.getImageInfo({
				src:res.tempFilePaths[0],
				success: ress => {
					// 获取图片大小
					let quality=0.3
					let beishu=3
					const maxSize1 = 3 * 1024 * 1024;  // 3MB
					const maxSize2 = 6 * 1024 * 1024;  // 6MB
					if (imageSize > maxSize2) {
					    quality = 0.1;  // 大于 6MB
						beishu=6
					} else if (imageSize > maxSize1) {
					    quality = 0.2;   // 大于 3MB 且小于等于 6MB
						beishu==5
					} else {
					    quality = 0.3;   // 小于等于 3MB
						beishu=3
					}
					
					let ctx = uni.createCanvasContext('firstCanvas3', that); /** 创建画布 */
					that.w = ress.width / beishu + 'px';
					that.h = ress.height / beishu + 'px';
						
					// 根据图片缩放后的宽度计算水印相关的比例
					const scaledWidth = ress.width / beishu;
					const baseWidth = 640; // 基准宽度，可根据实际情况调整
					const scaleRatio = scaledWidth / baseWidth;
						
					// 计算水印框的宽度，并设置最大和最小宽度
					let w = scaledWidth * 0.5;
					const minWidth = 200; 
					const maxWidth = 400; 
					w = Math.min(Math.max(w, minWidth), maxWidth);
						
					// 根据比例调整水印框的高度
					let h = 130 * scaleRatio;
						
					// 水印框放到左上角
					let x = 10 * scaleRatio;
					let y = 10 * scaleRatio;
					// 圆角半径
					let r = 10 * scaleRatio;
					
					that.$nextTick(function(){
						ctx.drawImage(res.tempFilePaths[0], 0, 0, ress.width / beishu, ress.height / beishu);	
					})
					that.$nextTick(function () {
					    ctx.beginPath();
					    ctx.setFillStyle('transparent');
					    ctx.arc(x + r, y + r, r, Math.PI, Math.PI * 1.5);
					    	
					    // border-top
					    ctx.moveTo(x + r, y);
					    ctx.lineTo(x + w - r, y);
					    ctx.lineTo(x + w, y + r);
					    // 右上角
					    ctx.arc(x + w - r, y + r, r, Math.PI * 1.5, Math.PI * 2);
					    	
					    // border-right
					    ctx.lineTo(x + w, y + h - r);
					    ctx.lineTo(x + w - r, y + h);
					    // 右下角
					    ctx.arc(x + w - r, y + h - r, r, 0, Math.PI * 0.5);
					    	
					    // border-bottom
					    ctx.lineTo(x + r, y + h);
					    ctx.lineTo(x, y + h - r);
					    // 左下角
					    ctx.arc(x + r, y + h - r, r, Math.PI * 0.5, Math.PI);
					    	
					    // border-left
					    ctx.lineTo(x, y + r);
					    ctx.lineTo(x + r, y);
					    	
					    // 填充水印区域
					    ctx.fill();
					    ctx.closePath();
					    ctx.clip();
					    ctx.setFillStyle('rgba(255, 255, 255, 0.3)');
					    ctx.fillRect(x, y, w, h);
					    	
					    // 从第一段代码获取固定值
					    let time = timeAll.time;
					    let date = timeAll.date;
					    let week = timeAll.weekDay;
					    let address = watermark.address || "位置未授权";
					    let jingweidu = watermark.jingweidu || "位置未授权";
					    let username = watermark.UserName;
					    let jobname = watermark.JobName;
					    	
					    let fillheight = 0;
					    // 根据比例调整字体大小
					    ctx.setFontSize(26 * scaleRatio); 
					    ctx.setFillStyle('#FFFFFF'); 
					    ctx.fillText(time, x + 20 * scaleRatio, y + 42 * scaleRatio + fillheight);
					    	
					    let timeW = ctx.measureText(time).width;
					    ctx.setFillStyle('#FFFF00'); 
					    ctx.fillRect(x + 30 * scaleRatio + timeW, y + 20 * scaleRatio + fillheight, 4 * scaleRatio, 24 * scaleRatio);
					    	
					    ctx.setFontSize(12 * scaleRatio); 
					    ctx.setFillStyle('#FFFFFF'); 
					    ctx.fillText(date, x + 30 * scaleRatio + timeW + 16 * scaleRatio, y + 32 * scaleRatio + fillheight);
					    	
					    ctx.setFontSize(12 * scaleRatio); 
					    ctx.setFillStyle('#FFFFFF'); 
					    ctx.fillText(week, x + 30 * scaleRatio + timeW + 16 * scaleRatio, y + 44 * scaleRatio + fillheight);
					    	
					    ctx.setFontSize(12 * scaleRatio); 
					    ctx.fillText(address, x + 20 * scaleRatio, y + 60 * scaleRatio + fillheight);
					    	
					    ctx.setFontSize(12 * scaleRatio); 
					    ctx.fillText(jingweidu, x + 20 * scaleRatio, y + 78 * scaleRatio + fillheight);
					    	
					    ctx.setFontSize(12 * scaleRatio); 
					    ctx.fillText("人员：" + username, x + 20 * scaleRatio, y + 94 * scaleRatio + fillheight);
					    	
					    ctx.setFontSize(12 * scaleRatio); 
					    ctx.fillText("数据类型：" + jobname, x + 20 * scaleRatio, y + 112 * scaleRatio + fillheight);
					});
					that.$nextTick(function(){
						uni.showLoading({
							title: '解析中...'
						})
						ctx.draw(false, () => {
							setTimeout(() => {
								uni.canvasToTempFilePath({
									canvasId: 'firstCanvas3',
									quality: quality, // 设置压缩质量 (0.1 - 1)
									success: res1 => {
										let tempImagePath121 = res1.tempFilePath;
										//加水印-end
										if(request.FileType=='SystemFile'){
											that.uploadImageToSystem(tempImagePath121,index,imagesIndex,fileType,watermark.customerName)
										}else
										{
											that.uploadImageToQiNiu(tempImagePath121,index,imagesIndex,fileType,watermark.customerName)
										}
									},fail() {
										uni.showToast({ title:'图片上传失败15', icon: 'none' });
									}
								},this);
							}, 1000);
						});
					})
				},fail() {
					uni.hideLoading();
					uni.showToast({ title:'图片上传失败13', icon: 'none' });
				}
			});
			//加水印-end
	    },
	    fail: (err) => {
		    uni.hideLoading();
		    uni.showToast({ title:'图片上传失败', icon: 'none' });
	    },
	  });
	},
	uploadImageToQiNiu(filePath,index,imagesIndex,fileType,customerName){
		//qiniuJS
		let that=this
		let qiNiuformData= {
			key:'',
			token: that.qiNiuToken
		}
		uni.hideLoading()
		uni.showLoading({
			title: '上传中...'
		})
		let uuid = that.getGUID()
		let timeFolder=time.getNowDateTimeFolder()
		let baseFilePath=this.$request22.QiNiuNameSpace+'/'+customerName+'/'+timeFolder+'/';
		let filePathName=''
		/////999工单 Scene，967 巡检强制拍照 WaterMarkeImages，968 巡检答题拍照 ScanTopicImages，969 维保图片 MaintenanceImages
		if(fileType==999){
			filePathName=baseFilePath+'Scene'+'/'+uuid+'.png'
		} else if(fileType==967){
			filePathName=baseFilePath+'WaterMarkeImages'+'/'+uuid+'.png'
		}else if(fileType==968){
			filePathName=baseFilePath+'ScanTopicImages'+'/'+uuid+'.png'
		}else if(fileType==969){
			filePathName=baseFilePath+'MaintenanceImages'+'/'+uuid+'.png'
		}else{
			filePathName=baseFilePath+'Scene'+'/'+uuid+'.png'
		}
		qiNiuformData.key = filePathName
		
		//qiniuJS
			
		uni.uploadFile({
			url: 'https://up-z0.qiniup.com', //仅为示例，非真实的接口地址
			filePath: filePath,
			name: 'file',
			header: {
				'Content-Type': 'multipart/form-data; charset=UTF-8' // 在这里设置编码
			},
			formData:qiNiuformData,
			success: (uploadFileRes) => {
				uni.hideLoading();
				let resultData=JSON.parse(uploadFileRes.data)
				
				if(uploadFileRes.statusCode==200){
					that.formDate2[index].rules[imagesIndex].value = this.$request22.imageUrl+qiNiuformData.key;
					//+'?imageMogr2/format/jpg/quality/30'
					this.$emit("update:formDate", this.formDate2);
					uni.showToast({ title:'上传成功', icon: 'none' });
				}else{
					uni.showToast({ title:'图片上传失败32', icon: 'none' });
				}
			},fail() {
				uni.hideLoading();
				uni.showToast({ title:'图片上传失败12', icon: 'none' });
			}
		});
	},
	uploadImageToQiNiuMulti(filePath,index,imagesIndex,fileType,customerName){
		//qiniuJS
		let that=this
		let qiNiuformData= {
			key:'',
			token: that.qiNiuToken
		}
		uni.hideLoading()
		uni.showLoading({
			title: '上传中...'
		})
		let uuid = that.getGUID()
		let timeFolder=time.getNowDateTimeFolder()
		let baseFilePath=this.$request22.QiNiuNameSpace+'/'+customerName+'/'+timeFolder+'/';
		let filePathName=''
		/////999工单 Scene，967 巡检强制拍照 WaterMarkeImages，968 巡检答题拍照 ScanTopicImages，969 维保图片 MaintenanceImages
		if(fileType==999){
			filePathName=baseFilePath+'Scene'+'/'+uuid+'.png'
		} else if(fileType==967){
			filePathName=baseFilePath+'WaterMarkeImages'+'/'+uuid+'.png'
		}else if(fileType==968){
			filePathName=baseFilePath+'ScanTopicImages'+'/'+uuid+'.png'
		}else if(fileType==969){
			filePathName=baseFilePath+'MaintenanceImages'+'/'+uuid+'.png'
		}else{
			filePathName=baseFilePath+'Scene'+'/'+uuid+'.png'
		}
		qiNiuformData.key = filePathName
		
		//qiniuJS
			
		uni.uploadFile({
			url: 'https://up-z0.qiniup.com', //仅为示例，非真实的接口地址
			filePath: filePath,
			name: 'file',
			header: {
				'Content-Type': 'multipart/form-data; charset=UTF-8' // 在这里设置编码
			},
			formData:qiNiuformData,
			success: (uploadFileRes) => {
				uni.hideLoading();
				let resultData=JSON.parse(uploadFileRes.data)
				console.log("imagesIndex:"+imagesIndex);
				console.log("imagesList:"+that.formDate2[index].rules.imagesList);
				if(uploadFileRes.statusCode==200){
					that.formDate2[index].rules.imagesList[imagesIndex] = this.$request22.imageUrl+qiNiuformData.key;
					//+'?imageMogr2/format/jpg/quality/30'
					this.$emit("update:formDate", this.formDate2);
					uni.showToast({ title:'上传成功', icon: 'none' });
				}else{
					uni.showToast({ title:'图片上传失败32', icon: 'none' });
				}
			},fail() {
				uni.hideLoading();
				uni.showToast({ title:'图片上传失败12', icon: 'none' });
			}
		});
	},
	uploadImageToSystem(filePath,index,imagesIndex,fileType,customerName){
		uni.hideLoading()
		uni.showLoading({
			title: '上传中...'
		})
		let token =uni.getStorageSync('userdata').token;
		uni.uploadFile({
			url: this.$request22.baseUrl+'api/UploadFile?fileModule='+fileType, //仅为示例，非真实的接口地址
			filePath: filePath,
			header:{
				'token': token,
			},
			name: 'fileList',
			method: 'post',
			success: (uploadFileRes) => {
				uni.hideLoading();
				console.log(5)
				let result=JSON.parse(uploadFileRes.data)
				console.log(result)
				if(result.code == 1){
					this.formDate2[index].rules[imagesIndex].value = this.$request22.baseUrl1+result.data;
					this.$emit("update:formDate", this.formDate2);
				}
			},fail() {
				uni.hideLoading();
				uni.showToast({ title:'图片上传失败', icon: 'none' });
			}
		});
	},
	uploadImageToSystemMulti(filePath,index,imagesIndex,fileType,customerName){
		uni.hideLoading()
		uni.showLoading({
			title: '上传中...'
		})
		let token =uni.getStorageSync('userdata').token;
		uni.uploadFile({
			url: this.$request22.baseUrl+'api/UploadFile?fileModule='+fileType, //仅为示例，非真实的接口地址
			filePath: filePath,
			header:{
				'token': token,
			},
			name: 'fileList',
			method: 'post',
			success: (uploadFileRes) => {
				uni.hideLoading();
				console.log(5)
				let result=JSON.parse(uploadFileRes.data)
				console.log(result)
				if(result.code == 1){
					this.formDate2[index].rules.imagesList[imagesIndex]=this.$request22.baseUrl1+result.msg
					this.$emit("update:formDate", this.formDate2);
				}
			},fail() {
				uni.hideLoading();
				uni.showToast({ title:'图片上传失败', icon: 'none' });
			}
		});
	},
	getGUID() {
	  return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
	    var r = Math.random() * 16 | 0,
	        v = c === 'x' ? r : (r & 0x3 | 0x8);
	    return v.toString(16);
	  });
	},
	//获取七牛云token
	getQiNiuToken() {
		let that=this
		let opts = {
			url: 'api/GetQiNiuToken',
			method: 'get'
		};
		request.httpTokenRequest(opts).then(res => {
			uni.hideLoading();
			if(res.data.code == 1){
				that.qiNiuToken= res.data.msg
			}
			else{
				uni.showToast({ title: '云文件存储异常，请联系客服', icon: 'none' });
			}
		});
	},
	// 上传视频
	chooseVideo(index) {
		//console.log('chooseVideo')
		let	that=this
	    uni.showLoading({title: '解析中...'})
		that.getQiNiuToken()
		that.getCustomerName()
	    uni.chooseVideo({
			maxDuration:20,
			sourceType:['camera'],
			compressed:true,
			success: function (res) {
				uni.hideLoading();
				if(request.FileType=='SystemFile'){
					that.chooseVideoSystem(res.tempFilePath,index,9999)
				}else
				{
					that.uploadVideoToQiNiu(res.tempFilePath,index)
				}
			},
			fail: (err) => {
				//console.log(err)
				uni.showToast({ title:'视频上传失败', icon: 'none' });
			}
		});
	},
	// 上传视频-系统
	chooseVideoSystem(filePath,index,fileType) {
		let	that=this
	    uni.showLoading({title: '上传中...'})
	    let token =uni.getStorageSync('userdata').token;
	    uni.uploadFile({
	    	url: that.formDate2[index].url+'api/UploadFile?fileModule='+fileType, //仅为示例，非真实的接口地址
	    	filePath:filePath,
	    	header:{
	    		'token': token,
	    	},
	    	name: 'fileList',
	    	method: 'post',
	    	success: (uploadFileRes) => {
	    		uni.hideLoading();
	    		let result=JSON.parse(uploadFileRes.data)
	    		//console.log(result)
	    		if(result.code == 1){
	    			that.formDate2[index].rules.value =result.data;
	    			that.$emit("update:formDate", that.formDate2);
	    		}
	    	},fail() {
	    		uni.hideLoading();
	    		uni.showToast({ title:'视频上传失败', icon: 'none' });
	    	}
	    });
	},
	getCustomerName(){
		let that=this
		let imageIndex= 2
		let opts = {
			url: 'api/getCustomerName',
			method: 'get'
		};
		request.httpTokenRequest(opts).then(res => {
			if(res.data.code == 1){
				that.customerName=res.data.msg
			}
			else{
				uni.showToast({ title: res.data.msg, icon: 'none' });
			}
		})	
	},
	uploadVideoToQiNiu(filePath,index){
		let that=this
		uni.showLoading({
			title: '上传中...'
		})
		let qiNiuformData= {
			key:'',
			token: that.qiNiuToken
		}
		let uuid = that.getGUID()
		let timeFolder=time.getNowDateTimeFolder()
		let baseFilePath=this.$request22.QiNiuNameSpace+'/'+that.customerName+'/'+timeFolder+'/';
		let filePathName=baseFilePath+'Videos'+'/'+uuid+'.mp4'
		qiNiuformData.key = filePathName
		uni.uploadFile({
			url: 'https://up-z0.qiniup.com', //仅为示例，非真实的接口地址
			filePath: filePath,
			name: 'file',
			formData:qiNiuformData,
			success: (uploadFileRes) => {
				uni.hideLoading();
				let resultData=JSON.parse(uploadFileRes.data)
				if(uploadFileRes.statusCode==200){
					that.formDate2[index].rules.value =resultData.key;
					//that.formDate2[index].rules[imagesIndex].value = this.$request22.imageUrl+resultData.key;
					this.$emit("update:formDate", this.formDate2);
					uni.showToast({ title:'上传成功', icon: 'none' });
				}else{
					uni.showToast({ title:'视频上传失败32', icon: 'none' });
				}
			},fail() {
				uni.hideLoading();
				uni.showToast({ title:'视频上传失败12', icon: 'none' });
			}
		});
	},
	
	// 删除视频
	deleteVideo(index) {
		let that=this
		uni.showLoading({
			title: '删除中...'
		})
		let opts = {
			url: 'api/DeleteQiNiuFile',
			method: 'get'
		};
		let params={
			filePath:that.formDate2[index].rules.value,
			isComplete:true
		}
		request.httpTokenRequest(opts,params).then(res => {
			uni.hideLoading();
			if(res.data.code == 1){
			    that.formDate2[index].rules.value = "";
			    this.$emit("update:formDate", this.formDate2);
			}
			else{
				uni.showToast({ title: res.data.msg, icon: 'none' });
			}
		});
	},
    //选择值
    selectItem(value, index) {
      this.currentSelectValue = value;
      for (var i = 0; i < this.selectBox.length; i++) {
        this.$set(this.selectBox[i], "flag", false);
      }
      this.selectBox[index].flag = true;
    },
    // 发送验证码
    sendCode() {
      var that = this;
      var setTime = 0;
      if (!that.isSend) {
        that.isSend = true;
        setTime = setInterval(function () {
          that.wait--;
          that.sendColor = "color:#999";
          that.codeFont = that.wait + "重新发送";
          if (that.wait == 0) {
            clearInterval(setTime);
            that.codeFont = "获取验证码";
            that.isSend = false;
            that.wait = 60;
            that.sendColor = "color:#ff5b01";
          }
        }, 1000);
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.plaClass {
  text-align: right;

  font-size: 26rpx;
}
// 弹框
.select-modal {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 300000;
  .select-bg {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
  }
  .select-box {
    position: absolute;
    left: 0;
    bottom: -1000upx;
    width: 100%;
    background: #fff;
    max-height: 50%;
    // height: 0%;
    overflow: auto;
    .select-title {
      display: flex;
      justify-content: space-between;
      height: 80upx;
      background: #f5f5f5;
      line-height: 80upx;
      padding: 0 30upx;
    }
    .select-item {
      font-size: 28upx;
      color: #333;
      border-bottom: 1px solid #eee;
      height: 75upx;
      line-height: 75upx;
      padding: 0 30upx;
      i {
        display: block;
        float: right;
        border-bottom: 4upx solid #1ca032;
        border-right: 4upx solid #1ca032;
        width: 12upx;
        height: 26upx;
        transform: rotate(45deg);
        margin-top: 24.5upx;
      }
    }
  }
  @keyframes mymove {
    0% {
      max-height: 10%;
    }

    100% {
      max-height: 50%;
    }
  }

  /*Safari 和 Chrome:*/
  @-webkit-keyframes mymove {
    0% {
      max-height: 10%;
    }

    100% {
      max-height: 50%;
    }
  }
}

// 下拉icon
.select-icon {
  // display: block;
  float: right;
  border-bottom: 2upx solid #999;
  border-right: 2upx solid #999;
  width: 16upx;
  height: 16upx;
  transform: rotate(-45deg);
  margin-right: 10upx;
}
.color-orange {
  color: var(--color);
}
.color-999 {
  color: #999;
}
.font32 {
  font-size: 32upx;
}

.form-container {
	width: 100%;
  .del-button {
    font-size: 35rpx;
    color: #ccc;
    padding-left: 30rpx;
  }
  .form-box {
    width: 100%;
    box-sizing: border-box;
  }
  .colorRed {
    color: red;
    padding: 0 10rpx;
  }
  .img-box {
    border-bottom: 1px solid #ededed;
    .line-right {
		float: left;
      margin-left: 36rpx;
    }
    padding: 30upx 0;
    .update-img-box {
      border: 1px solid #ededed;
      display: flex;

      .update-img {
        width: 140upx;
        height: 140upx;
      }
    }
    .update-img-box2 {
      overflow: hidden;
      display: flex;
    }
    .update-img-box,
    .update-btn-box {
      width: 140upx;
      height: 140upx;
      position: relative;
      margin-top: 20upx;
    }
    .update-img-box .close-img {
      width: 40upx;
      height: 40upx;
      position: absolute;
      right: -12upx;
      top: -16upx;
      background: #fff;
      border-radius: 50%;
    }
    img {
      width: 140upx;
      height: 140upx;
      object-fit: cover;
    }
	.fileuploadBox{
		margin: 34rpx;
		width: 78vw;
	}
	
	.uploadBox{
		margin: 20rpx 34rpx 0;
		.tipsWord{
			color: #000;
			font-size: small;
		}
		.uploadBtn{
			margin-top: 15rpx;
			background-color: #1F479E;
			color: #FFFFFF;
		}
	}
  }
  .line-right {
    flex: 1;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
  }
  // .line-bottom-select {
  //   padding-top: 40rpx;
  // }
  /*新增radio相关样式-start*/
  .line-bottom-select {
    padding-top: 20rpx;
    width: 100%;
    display: flex;
    flex-wrap: wrap; /* 允许换行 */
    align-items: center;
  }
  
  /* 修改radio选项的样式 */
  .f-radio {
    // margin-right: 30rpx;
    // margin-bottom: 20rpx;
    // flex-shrink: 0; /* 防止缩小 */
    // min-width: 150rpx; /* 设置最小宽度 */
  }
  
  /* 调整radio标签的间距 */
  .u-radio__label {
    margin-left: 10rpx;
    margin-right: 10rpx;
    font-size: 28rpx;
  }
  
  /* 调整radio图标和标签的对齐 */
  .u-radio {
    display: flex;
    align-items: center;
  }
  /*新增radio相关样式-end*/

  .line-bottom-textarea {
    padding-top: 20rpx;
    textarea {
      min-height: 200rpx;
    }
  }
  min-height: 200px;
  .send-code-box {
    .send-code {
      font-size: 28upx;
      padding: 0;
      white-space: nowrap;
      // width: 60%;
      //color:#ff5b01;
      height: 90upx;
      line-height: 90upx;
      cursor: pointer;
    }
  }
  .line-left {
    display: flex;
    min-width: 22%;
    align-items: center;
    height: 100%;
    letter-spacing: 0.5px;
    font-size: 26rpx;
    // font-weight: 550;
    color: #000000;
    box-sizing: border-box;
  }
  .img-label {
    width: 100%;
    height: 100%;
    font-size: 28upx;
    color: #333;
    box-sizing: border-box;
  }
  .p-l14 {
    padding-left: 34rpx;
  }
  .textarea-box {
    // display: flex;
    width: 100%;
    border-bottom: 1px solid #ededed;
    padding-top: 20upx;
    // align-items: center;
    textarea {
      padding-left: 32rpx;
      height: 100rpx;
      font-size: 25rpx;
      color: #333;
    }
  }
  .line {
    padding: 27rpx 0;
    margin-top: 30upx;
    // min-height: 100rpx;
    display: flex;
    align-items: center;
    width: 100%;
    margin: 0 auto;
    border-bottom: 1px solid #ededed;
    overflow: hidden;
    .input {
		padding-left: 20upx;
      padding-right: 20upx;
      height: 100%;
      width: 100%;
      text-align: left;
      font-size: 28upx;
      color: #333;
      border: none;
      overflow: hidden;
      text-overflow: ellipsis;
      outline: none;
    }
  }
  .line-col {
    padding: 27rpx 0;
    margin-top: 30upx;
    // min-height: 100rpx;
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0 auto;
    border-bottom: 1px solid #ededed;
    overflow: hidden;
    .input {
      padding-right: 20upx;
      height: 100%;
      width: 100%;
      text-align: left;
      font-size: 28upx;
      color: #333;
      border: none;
      overflow: hidden;
      text-overflow: ellipsis;
      outline: none;
    }
  }
  .num {
    margin-right: 8rpx;
  }
  // 自定义css
  .flex-row {
    display: flex;
  }

  .flex-row-c {
    display: flex;
    justify-content: center;
  }

  .flex-row--c {
    display: flex;
    align-items: center;
	width: 95%;
	background-color: #FFFFFF;
	margin: 10rpx auto;
	border-radius: 20rpx;
	padding: 20rpx 30rpx 0rpx;
	position: relative;
  }

  .flex-row-c-c {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .flex-row-sb-c {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .flex-row-sb-t {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }

  .flex-row-sb-b {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
  }

  .flex-row-c-sb {
    display: flex;
    justify-content: center;
    align-items: space-between;
  }

  .flex-row-sb {
    display: flex;
    justify-content: space-between;
  }

  .flex-row-l {
    display: flex;
    justify-content: flex-start;
  }

  .flex-row-l-c {
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }

  .flex-row-c-t {
    display: flex;
    justify-content: center;
    align-items: flex-start;
  }

  .flex-row-r-c {
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }

  .flex-row-r {
    display: flex;
    justify-content: flex-end;
  }

  .flex-row--b {
    display: flex;
    align-items: flex-end;
  }

  .flex-col {
    display: flex;
    flex-direction: column;
  }

  .flex-col-c {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .flex-col--c {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .flex-col-c-c {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .flex-col-sb-c {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
  }

  .flex-col-c-sb {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: space-between;
  }

  .flex-col-sb {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .flex-col-t-c {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
  }

  .flex-col-c-l {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
  }

  .flex-col-t {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
  }

  .flex-col-b {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
  }

  .flex-col-b-c {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
  }

  .flex-col-c-l {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
  }

  .flex-col--l {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }

  .flex-col--r {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
  }
}


// .remark-input {
//     margin-top: 20rpx;
//     width: 100%;
//     .remark-input-field {
//         width: 100%;
//         height: 80rpx;
//         border: 1px solid #eee;
//         border-radius: 8rpx;
//         padding: 0 20rpx;
//         font-size: 28rpx;
//         background: white;
//         z-index: 1000; // 确保层级足够高
// 		color:#333
//     }
// }
.remark-input {
    margin-top: 20rpx;
    width: 100%;
    .remark-input-field {
        width: 100%;
        height: 120rpx; // 使用 min-height 代替 height 以适应多行内容
        border: 1px solid #eee;
        border-radius: 8rpx;
        padding: 10rpx 20rpx; // 适当增加内边距以显示多行内容
        font-size: 30rpx;
        background: white;
        z-index: 1; // 确保层级足够高
        color:#333;
        box-sizing: border-box; // 避免 padding 影响宽度
        resize: vertical; // 允许用户垂直调整大小
    }
}
</style>
